<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Book Store</title>
<link rel="stylesheet" type="text/css" href="${path }/style/style.css" />
	<script>
		function selectAll(obj){
			var checks = document.getElementsByName("itemCheck");
			for(var i=0;i<checks.length;i++){
				if(obj.checked){
					checks[i].checked = true;
				}else {
					checks[i].checked = false;
				}
			}
		}
		
		function removeCart(){
			var ids = "";
			var count = 0;
			var checks = document.getElementsByName("itemCheck");
			for(var i=0;i<checks.length;i++){
				if(checks[i].checked){
					count++;
					ids += checks[i].value+":";
				}
			}
			
			if(count < 1){
				alert("至少选中一个商品!!!")
				return ;
			}else {
				var xmlHttp = new XMLHttpRequest();
				xmlHttp.onreadystatechange = function(){
					if(xmlHttp.status == 200){
						if(xmlHttp.readyState == 4){
							var str = xmlHttp.responseText;
							
							if(str == '1'){
								alert("成功删除!!!");
								location = "${path }/cart/showcart";
							}
						}
					}
				}
				var url = "${path }/cart/removeCartAjax?ids="+ids;
				xmlHttp.open("get",url,true);
				xmlHttp.send();
				
			}
		}
		
		//id:所修改商品的id值，obj：操作的当前对象，用来获取输入框值
		function modifyItem(id,obj){
			var count = obj.value;
			if(/^[1-9]\d*$/.test(count)){
				var xmlHttp = new XMLHttpRequest();
				xmlHttp.onreadystatechange = function(){
					if(xmlHttp.status == 200){
						if(xmlHttp.readyState == 4){
							var str = xmlHttp.responseText;
							
							if(str == '1'){
								alert("成功修改!!!");
								location.reload();
							}
						}
					}
				}
				var url = "${path }/cart/modifyCartAjax?bookId="+id+"&count="+count;
				xmlHttp.open("get",url,true);
				xmlHttp.send();
				
			}else {
				alert("数字格式不对!!!");
			}
		}
		
		//清空购物车
		function clearCart(){
			var xmlHttp = new XMLHttpRequest();
			xmlHttp.onreadystatechange = function(){
				if(xmlHttp.status == 200){
					if(xmlHttp.readyState == 4){
						var str = xmlHttp.responseText;
						if(str == '1'){
							alert("清除成功!!!");
							location.reload();
						}
					}
				}
			}
			var url = "${path }/cart/clearCartAjxa";
			xmlHttp.open("get",url,true);
			
			xmlHttp.send();
			
		}
		
		
		function balanceItem(){
			var count = 0;
			var ids = "";
			var checks = document.getElementsByName("itemCheck");
			
			for(var i=0;i<checks.length;i++){
				if(checks[i].checked){
					count++;
					ids += checks[i].value+":";
				}
			}
			
			if(count > 0){
				window.location = "${path }/permission/order/balance?ids="+ids.substring(0,ids.length-1);
			}else {
				alert("请至少选中一个商品!");
			}
			
		}
	</script>

</head>
<body>
<div id="wrap">

      <%@ include file="../common/header.jsp" %>
       
       
       <div class="center_content">
       	<div class="left_content">
            <div class="title"><span class="title_icon"><img src="${path }/images/bullet1.gif" alt="" title="" /></span>我的购物车</div>
        
        	<div class="feat_prod_box_details">
            
            <table class="cart_table">
            	<tr class="cart_title">
                	<td><input type="checkbox" onclick="selectAll(this)" /></td>
                	<td>图片</td>
                	<td>书名</td>
                    <td>单价</td>
                    <td>数量</td>
                    <td>合计</td>               
                </tr>
                <c:forEach var="item" items="${shoppingCart.items }">
            	<tr>
                	<td><input type="checkbox" name="itemCheck" value="${item.value.bookId }" /></td>
                	<td><a href="${path }/book/detailBook?bookId=${item.value.bookId }"><img src="${path }/images/book_img/${item.value.imageUrl }" alt="" style='width:23px;height:35px' title="" border="0" class="cart_thumb" /></a></td>
                	<td>${item.value.bookName }</td>
                    <td>${item.value.price }元</td>
                    <td><input onblur="modifyItem('${item.value.bookId }',this)" type="text" name="count" value="${item.value.count }" style="width:30px; text-align:center" /></td>
                    <td>${item.value.price * item.value.count }$</td>               
                </tr>   
                </c:forEach>       
            	                 
                <tr>
                <td colspan="4" class="cart_total"><span class="red">总价:</span></td>
                <td> ${shoppingCart.total }$</td>                
                </tr>  
            </table>
            <a href="${path }/book/index" class="continue">&lt; &lt;继续买</a>
            <a href="javascript:void(0)" onclick="balanceItem()" class="checkout">结算</a>
            <a href="javascript:void(0)" onclick="removeCart()" class="checkout">删除</a>
            <a href="javascript:void(0)" onclick="clearCart()" class="checkout">清空</a>
          </div>	

        <div class="clear"></div>
        </div><!--end of left content-->
        
        <%-- <div class="right_content">
        
                	<div class="languages_box">
            <span class="red">Languages:</span>
            <a href="#"><img src="${path }/images/gb.gif" alt="" title="" border="0" /></a>
            <a href="#"><img src="${path }/images/fr.gif" alt="" title="" border="0" /></a>
            <a href="#"><img src="${path }/images/de.gif" alt="" title="" border="0" /></a>
            </div>
                <div class="currency">
                <span class="red">Currency: </span>
                <a href="#">GBP</a>
                <a href="#">EUR</a>
                <a href="#"><strong>USD</strong></a>
                </div> --%>
                
          <!-- 右边内容开始 -->   
    	<%@ include file="../common/aside.jsp" %>      
     <%--          <div class="cart">
                  <div class="title"><span class="title_icon"><img src="${path }/images/cart.gif" alt="" title="" /></span>我的购物车</div>
                  <div class="home_cart_content">
                  ${cart.allcount }个商品 | <span class="red">总价: ${cart.allPrice }$</span>
                  </div>
                  <a href="${path }/jsp/cart/cart.jsp" class="view_cart">查看购物车</a>
              
              </div>
        
             <div class="title"><span class="title_icon"><img src="${path }/images/bullet3.gif" alt="" title="" /></span>关于我们店</div> 
             <div class="about">
             <p>
             <img src="${path }/images/about.gif" alt="" title="" class="right" />
             本书店是天创集团旗下的天智教育经营的书店，开业十年来，一直与国内外五百家出版社，近千家发行单位保持着良好的合作关系。以其集文化传播、艺术鉴赏、休闲为一体的崭新经营方式、一流的购书环境及优质的服务，赢得了众多的荣誉，成为华东地区最大的集图书、音像制品、文化用品、快餐、软件开发、广告策划于一体的图书零售企业。
             </p>
             
             </div>
             
             <div class="right_box">
             
             	<div class="title"><span class="title_icon"><img src="images/bullet4.gif" alt="" title="" /></span>推荐图书</div> 
                    <c:forEach var="t" items="${tuijianBook.books }">
			           <div class="new_prod_box">
			               <a href="javascript:void(0)" onclick="detailsBook('${t.bookId}')">${t.bookName }</a>
			               <div class="new_prod_bg">
			               <span class="new_icon"><img src="${path }/images/promo_icon.gif" alt="" title="" /></span>
			               <a href="javascript:void(0)" onclick="detailsBook('${t.bookId}')"><img  src="${path }/images/${t.imgUrl }" style="width:60px;height:90px" alt="" title="" class="thumb" border="0" /></a>
			               </div>           
			           </div>
			        </c:forEach>  
             
             </div>
             
             <div class="right_box">
             
             	<div class="title"><span class="title_icon"><img src="images/bullet5.gif" alt="" title="" /></span>图书分类</div> 
                
                <ul class="list">
                <li><a href="#">accesories</a></li>
                <li><a href="#">books gifts</a></li>
                <li><a href="#">specials</a></li>
                <li><a href="#">hollidays gifts</a></li>
                <li><a href="#">accesories</a></li>
                <li><a href="#">books gifts</a></li>
                <li><a href="#">specials</a></li>
                <li><a href="#">hollidays gifts</a></li>
                <li><a href="#">accesories</a></li>
                <li><a href="#">books gifts</a></li>
                <li><a href="#">specials</a></li>                                              
                </ul>
                
             	<div class="title"><span class="title_icon"><img src="images/bullet6.gif" alt="" title="" /></span>合作伙伴</div> 
                
                <ul class="list">
                <li><a href="#">accesories</a></li>
                <li><a href="#">books gifts</a></li>
                <li><a href="#">specials</a></li>
                <li><a href="#">hollidays gifts</a></li>
                <li><a href="#">accesories</a></li>
                <li><a href="#">books gifts</a></li>
                <li><a href="#">specials</a></li>
                <li><a href="#">hollidays gifts</a></li>
                <li><a href="#">accesories</a></li>                              
                </ul>      
             
             </div>  --%>        
             
        
        </div><!--end of right content-->
        
        
       
       
       <div class="clear"></div>
       </div><!--end of center content-->
       
       <%@ include file="../common/foot.jsp" %>
	   
</div>

</body>
</html>

